/**
 * #### 在控制台输出图片
 * @param {string} url 图片地址
 * @param {number} scale 图片缩放比率
 * @author JYeontu
 * @see https://juejin.cn/post/7446240175640870966
 */
console.image = function (url, scale = 1) {
  // 创建一个新的Image对象
  const img = new Image();
  // 设置图片的跨域属性
  img.crossOrigin = "Anonymous";
  // 图片加载完成后执行的函数
  img.onload = function () {
    // 创建一个新的canvas元素
    const canvas = document.createElement("canvas");
    // 获取canvas的上下文
    const ctx = canvas.getContext("2d");
    // 获取图片的宽度和高度
    const { width, height } = img;
    // 设置canvas的宽度和高度
    canvas.width = width;
    canvas.height = height;
    // 设置填充颜色为白色
    ctx.fillStyle = "white";
    // 在canvas上绘制一个矩形
    ctx.fillRect(0, 0, width, height);
    // 在canvas上绘制图片
    ctx.drawImage(img, 0, 0, width, height);
    // 将canvas转换为base64格式的图片
    const base64 = canvas.toDataURL("image/png");
    // 在控制台输出图片
    console.log(
      "%c ",
      `
        padding: ${(width * scale) / 2}px ${(height * scale) / 2}px;
        background: url(${base64});
        background-size: ${width * scale}px ${height * scale}px;
        background-repeat: no-repeat;
        color: transparent;
      `
    );
  };
  // 设置图片的src属性
  img.src = url;
};
